/**
 * 自定义函数
 * */


var formList = {
    data: [],
    pages: {start: 0, limit: 10}
}; //数据列表
var formArys = {
    uid: '', //用户ID
    title: '', //物品名
    imgs: [], //图片集合
    attrs: [] //属性集合
}; //要提交的数据


//列表
function getIndex(){
    var formData = {
        aid: getAid(),
        pageStart: formList.pages.start,
        pageLimit: formList.pages.limit
    };
    console.log(formData);
    $.ajax({
        type: apis.tmp1Index.method,
        url: domain + apis.tmp1Index.url,
        data: formData,
        success: function (res) {
            console.log(res);
            if (res.code != 0) {
                if (formList.pages.start > 0) {
                    msgPop({msg: res.msg});
                }
                return
            }
            for (var i = 0; i < res.data.length; i ++) {
                formList.data.push(res.data[i]);
            }
            formList.pages.start ++;
            getHtml();
        },
        error: function () {
            console.log('网络错误');
        }
    });
}


//列表字符串
function getHtml(){
    var h = '', i, d = formList.data;
    var id = 0, img = '', lasttime = '';
    h += '';
    for (i = 0; i < d.length; i ++) {
        id = d[i].id;
        if (d[i].imgs.length > 0) {
            img = d[i].imgs[0].link;
        }
        lasttime = d[i].uptime==null ? '' : d[i].uptime;
        h += '<tr class="text-c">';
        h += '<td>' + id + '</td>';
        h += '<td>' + d[i].title + '</td>';
        h += '<td>' + d[i].tmp_code + '</td>';
        if (img == '') {
            h += '<td>-</td>';
        } else {
            h += '<td><img src="' + img + '" width="50"/></td>';
        }
        h += '<td>' + d[i].follow + '</td>';
        h += '<td>' + d[i].addtime + '</td>';
        h += '<td>' + lasttime + '</td>';
        h += '<td class="td-manage">';
        h += '<a href="javascript:;" title="编辑" class="ml-5" onclick="viewEdit(' + id + ');">';
        h += '编辑<i class="Hui-iconfont">&#xe6df;</i>';
        h += '</a>';
        h += '&nbsp;';
        h += '<a href="' + routes.tmp1Comment + '?tmpId=' + id+ '" class="ml-5">';
        h += '用户评论';
        h += '</a>';
        h += '&nbsp;';
        h += '<a href="' + routes.tmp1History + '?tmpId=' + id+ '" class="ml-5">';
        h += '修改历史';
        h += '</a>';
        h += '</td>';
        h += '</tr>';
    }
    h += '';
    $('#formList').html(h);
    $('#tableMore').show();
}


//表单新增
function viewAdd(){
    var cw = document.documentElement.clientWidth;
    var ch = document.documentElement.clientHeight;
    var h = '';
    h += '';
    h += '<div style="position: fixed; top: 0; left: 0; z-index: 10000;">';
    h += '<div style="width: ' + (cw) + 'px; height: ' + (ch) + 'px; background: #000; opacity: 0.2; position: fixed; top: 0; left: 0; z-index: 10000;"></div>';
    h += '<div style="padding: 10px 20px; width: ' + (cw * 0.6) + 'px; max-height: 400px; text-align: center; background: #fff; color: #333; border-radius: 5px; overflow-x: hidden; overflow-y: auto; position: fixed; top: 5%; left: ' + ((cw * 0.5 - 40) / 2) + 'px; z-index: 10000;">';
    h += '<div style="text-align: center; font-weight: bolder; font-size: 20px;">新增</div>';
    h += '<form class="form form-horizontal" style="padding: 20px; max-height: 500px; overflow-x: hidden; overflow-y: auto;">';
    //用户编码
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>用户ID：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    h += '<input type="text" class="input-text" placeholder="输入用户编码" id="uid" value="" onblur="formArys.uid=this.value;"/>';
    h += '</div>';
    h += '</div>';
    ////二维编码
    //h += '<div class="row cl">';
    //h += '<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>二维编码：</label>';
    //h += '<div class="formControls col-xs-8 col-sm-9">';
    //h += '<input type="text" class="input-text" placeholder="输入二维码值" id="code" value="85s5Uv" onblur="formArys.code=this.value;"/>';
    //h += '</div>';
    //h += '</div>';
    //物品名
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>物品名：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    h += '<input type="text" class="input-text" placeholder="输入物品名" id="title" value="" onblur="formArys.title=this.value;"/>';
    h += '</div>';
    h += '</div>';
    //图片
    //h += '<style type="text/css"></style>';
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3">图片：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    h += '<div id="uploadOut">';
    h += uploadHtml();
    h += '</div>';
    h += '<div id="imgs" style="max-width: 150px; max-height: 400px; overflow: auto; float: left;"></div>'
    h += '</div>';
    h += '</div>';
    //自定义属性
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3">自定义属性：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    h += '<div id="attrOut">';
    h += '<input type="text" class="input-text" placeholder="点击设置属性名" style="width: 35%;" onblur="attrKey(this.value);"/> &nbsp;';
    h += '<input type="text" class="input-text" placeholder="输入属性值" style="width: 60%;" onclick="msgPop({msg: \'先设置左侧属性名\'});" readonly/>'
    h += '</div>';
    h += '</div>';
    h += '</div>';
    //按钮
    h += '<div class="row cl">';
    //h += '<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">';
    h += '<div class="col-xs-8 col-sm-9 col-xs-offset-3 col-sm-offset-2">';
    h += '<button class="btn btn-default radius" type="button" onClick="$(\'#formPop\').html(\'\');">&nbsp; 取 消 &nbsp;</button> <button class="btn btn-secondary radius" type="button" onClick="tmpAdd();"><i class="Hui-iconfont">&#xe632;</i> 保 存 </button>';
    h += '</div>';
    h += '</div>';
    h += '</form>';
    h += '</div>';
    h += '</div>';
    h += '';
    $('#formPop').html(h);
}


//增加属性
function attrKey(v){
    if (v == '' || v == undefined) {
        msgPop({msg: '属性名必须的'}); return
    }
    formArys.attrs.push({attrId: 0, tmpId: 0, attrName: v, attrVal: ''});
    getAttrHtml();
}


//属性字符串
function getAttrHtml(){
    var h = '', i;
    for (i = 0; i < formArys.attrs.length; i ++) {
        h += '<input type="text" class="input-text" style="width: 30%;" value="' + formArys.attrs[i].attrName + '" onblur="formArys.attrs[' + i + '].attrName=this.value; console.log(formArys);"/> &nbsp;';
        h += '<input type="text" class="input-text" style="width: 50%;" value="' + formArys.attrs[i].attrVal + '" onblur="formArys.attrs[' + i + '].attrVal=this.value; console.log(formArys);"/>';
        h += '<a href="javascript:;" style="padding: 7px 10px; background: red; color: #eee; font-size: 12px;" onclick="attrDel(' + i + ');">删除</a>';
        h += '<div style="height: 5px;"></div>';
    }
    h += '<input type="text" class="input-text" placeholder="点击设置属性名" style="width: 30%;" onblur="attrKey(this.value);"/> &nbsp;';
    h += '<input type="text" class="input-text" placeholder="输入属性值" style="width: 60%;" onclick="msgPop({msg: \'先设置左侧属性名\');" readonly/>';
    console.log(formArys);
    $('#attrOut').html(h);
}


//删除指定属性
function attrDel(v){
    if (formArys.attrs.length == 0) {
        msgPop({msg: '没有属性'});
        return
    }
    var attrArys = [];
    for (var i = 0; i < formArys.attrs.length; i++) {
        if (i != v) {
            attrArys.push(formArys.attrs[i]);
        }
    }
    formArys.attrs = attrArys;
    getAttrHtml();
}


//上传HTML
function uploadHtml(){
    var h = '';
    h += '<div style="padding: 5px 0; width: 100px; background: #0088cc; border-radius: 5px; text-align: center; font-size: 12px; color: #fff; position: relative;">上传图片</div>';
    h += '<input type="file" id="uploadFile" style="width: 180px; height: 30px; opacity: 0.1; cursor: pointer; position: relative; top: -26px; left: -180px;" onchange="uploadImage()"/>';
    return h;
}


//图片HTML
function imgHtml(){
    var h = '';
    for (var i = 0; i < formArys.imgs.length; i ++) {
        h += '<div style="margin-bottom: 5px; width: 150px; height: 100px; overflow: hidden;">';
        h += '<img src="' + formArys.imgs[i].link + '" style="width: 150px;"/>';
        h += '<a href="javascript:;" style="padding: 5px 10px; color: #fff; background: red; font-size: 12px; border: 0; border-radius: 0; opacity: 0.7; position: relative; top: -110px; left: 50px;" onclick="imgDel(' + i + ');">点击删除</a>';
        h += '</div>';
    }
    return h;
}


//显示图片
function showImg(e){
    if (formArys.imgs.length >= 9) {
        msgPop({msg: '最多上传9个图'}); return
    }
    formArys.imgs.push({imgId: 0, tmpId: 0, link: e});
    $('#imgs').html(imgHtml());
    $('#uploadOut').html(uploadHtml());
    console.log(formArys);
}


//删除图片
function imgDel(v){
    var newImgs = [];
    for (var i = 0; i < formArys.imgs.length; i ++) {
        if (i != v) {
            newImgs.push(formArys.imgs[i]);
        }
    }
    formArys.imgs = newImgs;
    $('#imgs').html(imgHtml());
}


//新增物品
function tmpAdd(){
    if (formArys.ucode.length == 0) {
        msgPop({msg: '用户编码必须的'}); return
    }
    if (formArys.code.length == 0) {
        msgPop({msg: '二维编码必须的'}); return
    }
    if (formArys.title.length < 2) {
        msgPop({msg: '物品名不能少于2位'}); return
    }
    formArys.aid = getAid();
    console.log(formArys);
    $.ajax({
        type: apis.tmp1Add.method,
        url: domain + apis.tmp1Add.url,
        data: formArys,
        success: function (res) {
            console.log(res);
            if (res.code != 0) {
                msgPop({msg: res.msg}); return
            }
            msgPop({msg: '添加成功'});
            window.location.href = '';
        },
        error: function () {
            console.log('网络错误');
        }
    });
}


//表单修改
function viewEdit(v){
    var cw = document.documentElement.clientWidth;
    var ch = document.documentElement.clientHeight;
    var h = '', i, tmpOne = '';
    for (i = 0; i < formList.data.length; i ++) {
        if (formList.data[i].id == v) {
            tmpOne = formList.data[i];
        }
    }
    if (tmpOne == '') {
        msgPop({msg: '物品不存在'}); return
    }
    formArys = tmpOne;
    console.log(tmpOne);
    h += '';
    h += '<div style="position: fixed; top: 0; left: 0; z-index: 10000;">';
    h += '<div style="width: ' + (cw) + 'px; height: ' + (ch) + 'px; background: #000; opacity: 0.2; position: fixed; top: 0; left: 0; z-index: 10000;"></div>';
    h += '<div style="padding: 10px 20px; width: ' + (cw * 0.6) + 'px; text-align: center; background: #fff; color: #333; border-radius: 5px; position: fixed; top: 5%; left: ' + ((cw * 0.5 - 40) / 2) + 'px; z-index: 10000;">';
    h += '<div style="text-align: center; font-weight: bolder; font-size: 20px;">修改</div>';
    h += '<form class="form form-horizontal" style="padding: 20px; max-height: 500px; overflow-x: hidden; overflow-y: auto;">';
    //用户编码
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>用户编码：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    //h += '<input type="text" class="input-text" placeholder="输入用户编码" id="ucode" value="' + tmpOne.user_id + '" onblur="formArys.ucode=this.value;"/>';
    h += tmpOne.user_id;
    h += '<input type="hidden"  id="tmpCode" value="' + tmpOne.tmp_code + '"/>';
    h += '</div>';
    h += '</div>';
    //二维编码
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>二维编码：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    //h += '<input type="text" class="input-text" placeholder="输入二维码值" id="code" value="' + tmpOne.code + '" onblur="formArys.code=this.value;"/>';
    h += tmpOne.code;
    h += '</div>';
    h += '</div>';
    //物品名
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>物品名：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    h += '<input type="text" class="input-text" placeholder="输入物品名" id="title" value="' + tmpOne.title + '" onblur="formArys.title=this.value;"/>';
    h += '</div>';
    h += '</div>';
    //图片
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3">图片：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    h += '<div id="uploadOut">';
    h += uploadHtml();
    h += '</div>';
    h += '<div id="imgs" style="max-width: 150px; max-height: 400px; overflow: auto; float: left;">';
    for (i = 0; i < tmpOne.imgs.length; i ++) {
        h += '<div style="margin-bottom: 5px; width: 150px; height: 100px; overflow: hidden;">';
        h += '<img src="' + tmpOne.imgs[i].link + '" style="width: 150px;"/>';
        h += '<a href="javascript:;" style="padding: 5px 10px; color: #fff; background: red; font-size: 12px; border: 0; border-radius: 0; opacity: 0.7; position: relative; top: -110px; left: 50px;" onclick="imgDel(' + i + ');">点击删除</a>';
        h += '</div>';
    }
    h += '</div>';
    h += '</div>';
    h += '</div>';
    //自定义属性
    h += '<div class="row cl">';
    h += '<label class="form-label col-xs-4 col-sm-3">自定义属性：</label>';
    h += '<div class="formControls col-xs-8 col-sm-9">';
    h += '<div id="attrOut">';
    for (i = 0; i < tmpOne.attrs.length; i ++) {
        h += '<input type="text" class="input-text" style="width: 30%;" value="' + formArys.attrs[i].attrName + '" onblur="formArys.attrs[' + i + '].attrName=this.value; console.log(formArys);"/> &nbsp;';
        h += '<input type="text" class="input-text" style="width: 50%;" value="' + formArys.attrs[i].attrVal + '" onblur="formArys.attrs[' + i + '].attrVal=this.value; console.log(formArys);"/>';
        h += '<a href="javascript:;" style="padding: 7px 10px; background: red; color: #eee; font-size: 12px;" onclick="attrDel(' + i + ');">删除</a>';
        h += '<div style="height: 5px;"></div>';
    }
    h += '<input type="text" class="input-text" placeholder="点击设置属性名" style="width: 30%;" onblur="attrKey(this.value);"/> &nbsp;';
    h += '<input type="text" class="input-text" placeholder="输入属性值" style="width: 60%;" onclick="msgPop({msg: \'先设置左侧属性名\');" readonly/>';
    h += '</div>';
    h += '</div>';
    h += '</div>';
    //按钮
    h += '<div class="row cl">';
    h += '<div class="col-xs-8 col-sm-9 col-xs-offset-3 col-sm-offset-2">';
    h += '<button class="btn btn-default radius" type="button" onClick="$(\'#formPop\').html(\'\');">&nbsp; 取 消 &nbsp;</button> <button class="btn btn-secondary radius" type="button" onClick="tmpUpdate();"><i class="Hui-iconfont">&#xe632;</i> 保 存 </button>';
    h += '</div>';
    h += '</div>';
    h += '</form>';
    h += '</div>';
    h += '</div>';
    h += '';
    $('#formPop').html(h);
}


//更新物品
function tmpUpdate(){
    var tmpCode = $('#tmpCode').val();
    if (tmpCode == '') {
        msgPop({msg: '物品编码必须的'}); return
    }
    //if (formArys.ucode == '') {
    //    msgPop({msg: '用户编码必须的'}); return
    //}
    //if (formArys.code == '') {
    //    msgPop({msg: '二维编码必须的'}); return
    //}
    if (formArys.title.length < 2) {
        msgPop({msg: '物品名不能少于2位'}); return
    }
    var formData = {
        aid: getAid(),
        tmpCode: tmpCode,
        //ucode: formArys.ucode,
        //code: formArys.code,
        title: formArys.title,
        imgs: formArys.imgs,
        attrs: formArys.attrs
    };
    console.log(formData);
    //return
    $.ajax({
        type: apis.tmp1Modify.method,
        url: domain + apis.tmp1Modify.url,
        data: formData,
        success: function (res) {
            console.log(res);
            if (res.code != 0) {
                msgPop({msg: res.msg}); return
            }
            msgPop({msg: '修改成功'});
            window.location.href = '';
        },
        error: function () {
            console.log('网络错误');
        }
    });
}